.dynamic {
    background: #151619;
    height: 100%;
    cursor: pointer;
  }
  .title-tabs {
    height: 49px;
    padding: 0 11px;
    background: #1c1d21;
    display: flex;
    align-items: center;
    font-size: 15px;
    .tab {
      width: 115px;
      height: 35px;
      text-align: center;
      font-weight: 400;
      line-height: 35px;
      color: #bcbfc4;
      background: url($PIC_URL + "/tlbypcWeb/dynamicStock/bg.png") no-repeat;
      border-radius: 4px;
      margin-right: 10px;
      &:hover {
        color: #fff;
        background: url($PIC_URL + "/tlbypcWeb/dynamicStock/bg_hover.png")
          no-repeat;
      }
      &.active {
        color: #fff;
        background: url($PIC_URL + "/tlbypcWeb/dynamicStock/bg_sel.png") no-repeat;
      }
    }
    .date {
      margin-left: 10px;
      height: 35px;
      width: 161px;
      font-size: 15px;
      border: 1px solid #434448;
      border-radius: 4px;
      background: #1c1d21;
      line-height: 35px;
      display: flex;
      position: relative;
  
      .date-select {
        color: #bcbfc4;
        width: 140px;
        text-align: center;
      }
      .date-icon {
        display: inline-block;
        position: absolute;
        right: 10px;
        top: 8px;
        width: 20px;
        height: 18px;
        margin-left: 24px;
        background: url($PIC_URL + "/tlbypcWeb/dynamicStock/icons.png") no-repeat;
      }
    }
  }
  
  .header {
    display: flex;
    .headline {
      width: 129px;
      height: 38px;
      font-size: 18px;
      color: #e0e0e0;
      box-sizing: border-box;
      margin-right: 1px;
      display: flex;
      align-items: center;
      justify-content: center;
      &.activeL {
        border: 1px solid #f29459;
        color: #fff;
        &.orange {
          border: 1px solid #ef6b25;
          background: #813a14;
        }
        &.blue {
          border: 1px solid #829cff;
          background: #243989;
        }
        &.purple {
          border: 1px solid #9325ff;
          background: #4c1384;
        }
        &.sky-blue {
          border: 1px solid #45c1f2;
  
          background: #225f77;
        }
        &.yellow {
          border: 1px solid #f29459;
          background: #8e5734;
        }
        &.wathet {
          border: 1px solid #82b4ff;
          background: #244a89;
        }
      }
    }
    .orange {
      background: rgba(129, 58, 20, 0.5);
      &:hover {
        background: #813a14;
      }
    }
    .blue {
      background: rgba(36, 57, 137, 0.5);
      &:hover {
        background: #243989;
      }
    }
    .purple {
      background: rgba(76, 19, 132, 0.5);
      &:hover {
        background: #4c1384;
      }
    }
    .sky-blue {
      background: rgba(34, 95, 119, 0.5);
      &:hover {
        background: #225f77;
      }
    }
    .yellow {
      background: rgba(142, 87, 52, 0.5);
      &:hover {
        background: #8e5734;
      }
    }
    .wathet {
      background: rgba(36, 74, 137, 0.5);
      &:hover {
        background: #244a89;
      }
    }
  }
  .result {
    position: fixed;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    background: #090910;
    line-height: 30px;
    padding: 10px 0;
    display: flex;
    .left {
      margin-left: 22px;
      flex: 1;
      .title {
        font-size: 16px;
        color: #bcbfc4;
        margin-right: 10px;
      }
      .item {
        padding: 0 8px;
        height: 30px;
        display: inline-block;
        margin-right: 19px;
        font-size: 16px;
        color: #ff8a00;
        border: 1px dashed #1d202c;
        &:last-child {
          margin-right: 0;
        }
        .del {
          display: inline-block;
          width: 17px;
          height: 17px;
          position: relative;
          top: 3px;
          background: url($PIC_URL + "/tlbypcWeb/dynamicStock/x.png") no-repeat;
          &:hover {
            background: url($PIC_URL + "/tlbypcWeb/dynamicStock/x_hover.png")
              no-repeat;
          }
        }
      }
    }
    .right {
      float: right;
      width: 160px;
      color: #fff;
      font-size: 15px;
      text-align: center;
      padding-right: 22px;
      .s {
        display: inline-block;
        width: 72px;
        height: 30px;
      }
      .count {
        background: url($PIC_URL + "/tlbypcWeb/dynamicStock/btn_bgs.png")
          no-repeat;
        &:hover {
          background: url($PIC_URL + "/tlbypcWeb/dynamicStock/btn_bg_hover.png")
            no-repeat;
        }
      }
      .reset {
        margin-left: 9px;
        background: url($PIC_URL + "/tlbypcWeb/dynamicStock/btn_bgs.png")
          no-repeat;
      }
    }
  }